<!-- 区域雨水利用评价表 -->
<template>
    <CustomTableVue :field-list="useFields().spongDetectionRainUseFiield" :table-data="tableData" height="85%" >
       <template #conserve="slotProps">
     <div class="text-center" style="font-family:' DIN-Bold';color: rgba(0, 194, 255, 1);">
          {{ slotProps.row.conserve }} 
   </div>
   </template>

 </CustomTableVue>
</template>

<script setup lang='ts'>
import  CustomTableVue from '@/components/common/table/CustomTable.vue';
import { useFields } from "@/hook/useFields";
import { projectFunc } from "@/hook/projectFunc";

const tableData = ref([
{
    Area: projectFunc().randomArea(),
    year:'2012年12月',
    use:'2%',
    clean:'23%',
    emission:'35%',
    conserve:'11.2%',

},
,{
    Area: projectFunc().randomArea(),

    year:'2012年12月',
    use:'8%',
    clean:'21',
    emission:'45%',
    conserve:'11.2%',

},{
    Area: projectFunc().randomArea(),

    year:'2012年12月',
    use:'16%',
    clean:'23%',
    emission:'65%',
    conserve:'11.2%',

},{
    Area: projectFunc().randomArea(),

    year:'2012年12月',
    use:'17%',
    clean:'36%',
    emission:'16%',
    conserve:'41.3%',

},{
    Area: projectFunc().randomArea(),

    year:'2012年12月',
    use:'13%',
    clean:'28%',
    emission:'26%',
    conserve:'11.2%',

},

]);

</script>
 
<style scoped lang="less">

</style>